<script setup lang="ts">
import TitleBar from '@/components/common/TitleBar.vue'

const tableData = [
  { rank: 1, question: '红字发票如何开具？', askCount: 21, userCount: 3 },
  { rank: 2, question: '未打印就上传，如何解决？', askCount: 42, userCount: 54 },
  { rank: 3, question: '发票系统咋下载？', askCount: 23, userCount: 12 },
  { rank: 4, question: '作废已开发票和空白发票方法', askCount: 21, userCount: 3 },
  { rank: 5, question: '未打印就上传，如何解决？', askCount: 42, userCount: 54 },
  { rank: 6, question: '发票系统咋下载？', askCount: 23, userCount: 12 },
  { rank: 7, question: '红字发票如何开具？', askCount: 23, userCount: 12 },
]
</script>

<template>
  <div class="container">
    <title-bar>热门问题</title-bar>
    <el-table :data="tableData" style="width: 100%" :row-style="{ height: '70px' }">
      <el-table-column prop="rank" label="排行" width="180" />
      <el-table-column prop="question" label="问题" />
      <el-table-column prop="askCount" label="提问次数" width="180" />
      <el-table-column prop="userCount" label="提问的用户数" width="180" />
    </el-table>
  </div>
</template>

<style scoped>
.container {
  width: 100%;
  background-color: #fff;
}
</style>
